@import '../../../utils/common.scss';
.contractContainer {
  height: 100vh;
  background: #F5F5F5;
  .search {
    background: #ffffff;
    padding-left: .4rem;
    padding-top: .266667rem;
    padding-bottom: .266667rem;
    display: flex;
    align-items: center;
    .svgSize {
      width: .426667rem;
      height: .426667rem;
      margin-right: .133333rem;
      margin-left: .266667rem;
    }
    .buttonSize {
      width: 1.173333rem;
      height: .746667rem;
      border: .026667rem #EEEEEE solid;
      display: flex;
      align-items: center;
      justify-content: center;
      @include font-dpr(12Px);
      color: #666666;
      border-radius: .106667rem;
      margin-left: .266667rem
    }
    .activeSize {
      background:$primary-color;
      color:#ffffff
    }
    .cancelSize {
      color:#ffffff;
      transition: background .5s ease;
      @include font-dpr(15Px);
      margin-left: .4rem;
    }
  }
  .contentContainer {
    background: #ffffff;
    padding-left: .4rem;
    height: 100vh;
    .wantTitle {
      color: $primary-fontColor;
      @include font-dpr($primary-size-xs);
      @include lineHeight($primary-size-xs);
      margin-top: .48rem;
      margin-bottom: .533333rem
    }
    .orTitle {
      margin-top: .746667rem;
    }
    .buttonOptions {
      background: #ffffff;
      .buttonContainer {
        overflow: hidden;
        margin-bottom: .266667rem;
        .buttonSize {
          float: left;
          border: .026667rem #EEEEEE solid;
          border-radius: .053333rem;
          @include font-dpr(12Px);
          padding: .24rem .4rem;
          color: #666666;
          margin-right: .266667rem
        }
      }
    }
  }
  .searchList {
    background: #ffffff;
    padding-left: .4rem;
    margin-top: .266667rem;
    .itemContent{
      display: flex;
      align-items: center;
      @include font-dpr($primary-size-xs);
      position: relative;
      padding-top:.4rem;
      padding-bottom: .4rem;
      border-bottom: .026667rem #EEEEEE solid;
    }
    .unSign {
      color: $primary-color;
      width: 1.226667rem;
      height: 1.226667rem;
      background: #E3F1FF;
      border-radius:50%;
      display: flex;
      align-items: center;
      justify-content: center
    }
    .alreadySign {
      background: #f5f5f5;
      color: #999999;
      width: 1.226667rem;
      height: 1.226667rem;
      border-radius:50%;
      display: flex;
      align-items: center;
      justify-content: center
    }
    .textContainer {
      margin-left: .4rem;
      width: 6.853333rem;
      .textTitle {
        color: $primary-fontColor;
        @include font-dpr($primary-size-md);
        @include lineHeight($primary-size-md);
        margin-bottom: .346667rem;
      }
      .productContainer {
        display: flex;
        align-items: center;
        .productType {
          border:.026667rem #FF5B05 solid;
          @include font-dpr(12Px);
          padding:.08rem .133333rem;
          border-radius: .053333rem;
          color: #FF5B05;
          margin-right: .4rem
        }
        .textCode {
          color: #999999;
          @include font-dpr(12Px);
          @include lineHeight(12Px);
        }
      }
      
    }
    .svgContainer {
      position: absolute;
      right:.4rem;
      top: 50%;
      transform: translateY(-50%);
      .nextSvg {
        width: .186667rem;
        height: .373333rem;
      }
    }
  }
  :global {
    .am-list-view-scrollview {
      height: 100vh;
    }
    .originSize {
      width: 100%;
      position: absolute;
      top: 1.173333rem;
      transition: top .3s ease;
    }
    .cancelContractContainer {
      position: absolute;
      top: 0px;
      width: 100%;
      background: #ffffff;
      transition: top .3s ease;
    }
    .am-input-label {
      width: auto !important;
      margin-right: 0px;
    }
    .am-list-item {
      width: 6.213333rem;
      padding-left: 0px;
      min-height: auto;
      height: auto;
    }
    .cancelSearch {
      background:$primary-color;
      transition: background .5s ease;
      .am-list-item {
        width:8rem !important;
      }
    }
    .am-list-line {
      border:.026667rem #EEEEEE solid !important;
      border-radius: .106667rem;
      height: .8rem;
    }
    @keyframes fadeInUp {
      from {
        opacity: 0;
        -webkit-transform: translate3d(0, 80%, 0);
        transform: translate3d(0, 80%, 0);
      }
    
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
  }
  input::-webkit-input-placeholder {
    color:#BBBBBB !important;
    @include font-dpr($primary-size-xs);
  }
  .act {
    // transition: background 5s cubic-bezier(0.075, 0.82, 0.165, 1);
    background: blue;
    animation: fadeInUp 0.3s;
  }
  .loading {
    text-align: center;
    color: #999999;
    @include font-dpr(12Px)
  }
}
:global{
  .am-toast-notice-content {
    @include font-dpr(12Px)
  }
  
}